<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>示例</title>
	</head>
	<body>
		  <p>下面是一个无序列表</p>
		  <ul id="List1">
				<li>樱花</li>
				<li>桂花</li>
		  </ul>
		  <button onclick="myFunction1()">追加</button>
		  <button onclick="myFunction2()">插入</button>
		  <script>
				function myFunction1() 
				{
				   const enode = document.createElement("li");// 创建 "li" 节点：
				   const tnode = document.createTextNode("兰花");// 创建文本节点：
				   enode.appendChild(tnode);// 把文本节点附加到 "li" 节点：
				   document.getElementById("List1").appendChild(enode);// 把 "li" 节点附加到列表：
				}
		  </script>
		  <script>
				function myFunction2() 
				  {// 请补充myFunction2()函数的函数体实现在第一个列表项前面添加一个“菊花”项：
					 // 创建 "li" 节点：
					const newLi = document.createElement("li");
					// 创建文本节点 “菊花”：
					const textNode = document.createTextNode("菊花");
					// 把文本节点附加到 "li" 节点：
					newLi.appendChild(textNode);
					// 获取列表的引用：
					const list = document.getElementById("List1");
					// 如果列表中有至少一个子元素，则在第一个子元素前插入新的 "li" 节点：
					if (list.firstChild) {
					  list.insertBefore(newLi, list.firstChild);
					} else {
					  // 如果列表为空，则直接添加新的 "li" 节点：
					  list.appendChild(newLi);
					}
				  }
		  </script>
	</body>
</html>
